<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta http-equiv="X-UA-Compatible" content="IE=emulateIE7" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="csrf-token" content="{{ csrf_token() }}">

    <link href="{{ asset('/admins/css/bootstrap.min.css') }}" rel="stylesheet"> 
    <script src="{{ asset('/admins/js/jquery.min.js') }}"></script>
    <script src="{{ asset('/admins/js/bootstrap.min.js') }}"></script>
    
</head>
<body>
    <center>
        <div class="page-header">
           <h2>添加用户地址</h2>
        </div> 
        @if (count($errors) > 0)
          <div class="alert alert-danger">
              <ul>
                  @foreach ($errors->all() as $error)
                      <li>{{ $error }}</li>
                  @endforeach
            </ul>
            </div>
        @endif
    </center>
    <center>
        <div class="container-fluid">

            <form class="form-horizontal" role="form" action="/admin/Address" method="post">
                {{ csrf_field() }}
               <div class="form-group">
                  <label for="inputUName" class="col-sm-5 control-label">用户名：</label>
                  <div class="col-sm-2">
                    <input id="inputUName" type="text" name="uid" />
                  </div>
               </div>
               <div class="form-group">
                  <label for="inputAddress" class="col-sm-5 control-label">地址：</label>
                  <div class="col-sm-2">
                     <select id='cid' name="city1">
                        <option>---请选择---</option>
                    </select>
                  </div>
               </div>
               <div class="form-group">
                  <label for="inputDA" class="col-sm-5 control-label">详细地址：</label>
                  <div class="col-sm-2">
                    <input id="inputDA" type="text" name="detailAddress" />
                  </div>
               </div>
               <div class="form-group">
                  <label for="consignee" class="col-sm-5 control-label">收货人：</label>
                  <div class="col-sm-2">
                    <input id="consignee" type="text" name="consignee" />
                  </div>
               </div>
               <div class="form-group">
                  <label for="inputTel" class="col-sm-5 control-label">收货人手机号：</label>
                  <div class="col-sm-2">
                    <input id="inputTel" type="text" name="consigneePhone" placeholder="手机号11位"/>
                  </div>
               </div>

               <div class="form-group">
                  <div class="col-sm-offset-5 col-sm-2">
                     <button type="submit" class="btn btn-default">确认添加</button>
                  </div>
               </div>
            </form>
        </div>
    </center>
</body>
    <script src="{{ asset('/admins/js/jquery-1.8.3.min.js') }}"></script>
    <script type="text/javascript">
        $.ajax({
            url:'/admin/addressAdd/doget',
            type:'get',
            async:true,
            data:{upid:0},
            dataType:'json',
            
            success:function(data)
            {
                for (var i = 0; i < data.length; i++) {
                    $('#cid').append("<option value='"+data[i].id+"'>"+data[i].name+"</option>");
                };
            },
            error:function()
            {
                alert('ajax请求失败');
            }
        });
        
        var num = 2;
        $("select").live("change",function(){
            //删除掉选择的select后面所有的select
            $(this).nextAll('select').remove();
            //获取选择的select的值
            var ob = $(this).val();
            //判断是不是选择的默认，如果是默认就不执行ajax
            if(ob != '---请选择---'){
                //把当前对象保存下来，拿到ajax回调函数中使用
                var sel = $(this);
                //发送ajax
                $.ajax({
                    url:'/admin/addressAdd/dopost',
                    type:'post',
                    async:true,
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    data:{upid:ob},
                    dataType:'json',
                    success:function(data)
                    {
                        // console.log(data);
                        //如果返回的数组长度=0,说明没有下一个select
                        if(data.length>0){
                            //生成一个新的select
                            var select = $("<select name=city"+num+"><option>---请选择---</option></select>");
                            // console.log(data);
                            //把返回回来的数据遍历成option追加到新生成的select内
                            for (var i = 0; i < data.length; i++) {
                                $(select).append("<option value='"+data[i].id+"'>"+data[i].name+"</option>");
                            };
                            //把新生成的select追加到上一个select的后边
                            sel.after(select);
                            num++;
                        }
                    },
                    error:function()
                    {
                        alert('ajax请求失败');
                    }
                });
            }
        });
    </script>
</html>

